<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--suppress ALL-->
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link th:href="@{/resources/css/common.css}" rel="stylesheet" tyle="text/css" />
<link th:href="@{/resources/css/style.css}" rel="stylesheet" type="text/css" />
<link th:href="@{/resources/fonts/iconfont.css}" rel="stylesheet" type="text/css" />
<script th:src="@{resources/js/jquery.min.1.8.2.js}" type="text/javascript"></script>
<script th:src="@{/resources/js/payfor.js}" type="text/javascript"></script>
<script th:src="@{/resources/js/lrtk.js}" type="text/javascript"></script>
<script th:src="@{/resources/js/jquery.SuperSlide.2.1.1.js}" type="text/javascript"></script>
<script th:src="@{/resources/js/common_js.js}" type="text/javascript"></script>
<script th:src="@{/resources/js/footer.js}" type="text/javascript"></script>
<script th:src="@{/resources/js/jquery.jumpto.js}" type="text/javascript"></script>
<title>购物车</title>
</head>
<script type="text/javascript">
$(document).ready(function () {
   //全选
   $("#CheckedAll").click(function () {
	   if (this.checked) {                 //如果当前点击的多选框被选中
		   $('input[type=checkbox][name=checkitems]').attr("checked", true);
	   } else {
		   $('input[type=checkbox][name=checkitems]').attr("checked", false);
	   }
   });
   $('input[type=checkbox][name=checkitems]').click(function () {
	   var flag = true;
	   $('input[type=checkbox][name=checkitems]').each(function () {
		   if (!this.checked) {
			   flag = false;
		   }
	   });

	   if (flag) {
		   $('#CheckedAll').attr('checked', true);
	   } else {
		   $('#CheckedAll').attr('checked', false);
	   }
   });
   //输出值
   $("#send").click(function () {
	      if($("input[type='checkbox'][name='checkitems']:checked").attr("checked")){
	   var str = "你是否要删除选中的商品：\r\n";
	   $('input[type=checkbox][name=checkitems]:checked').each(function () {
		   str += $(this).val() + "\r\n";
	   })
	   alert(str);
		  }
		  else{
			   var str = "你未选中任何商品，请选择后在操作！";
			   alert(str);
       }

   });
})
</script>
<body>
 <div id="header_top">
  <div id="top">
    <div class="Inside_pages">
      <div class="Collection">下午好，欢迎光临onlineshop！</div>
	<div class="hd_top_manu clearfix">
	  <ul class="clearfix">
	   <li class="hd_menu_tit zhuce" data-addclass="hd_menu_hover">欢迎光临本店！<a th:href="@{/toLogin}" class="red">[请登录]</a> 新用户<a href="registered.html" class="red">[免费注册]</a></li>
	   <li class="hd_menu_tit" data-addclass="hd_menu_hover"><a th:href="@{/toOrder}">我的订单</a></li>
	   <li class="hd_menu_tit" data-addclass="hd_menu_hover"> <a th:href="@{/personal/toPersonCenter}">个人中心</a> </li>
	   <li class="hd_menu_tit list_name" data-addclass="hd_menu_hover"><a th:href="@{/personal/toHelper}" class="hd_menu">客户服务</a>
	    <div class="hd_menu_list">
		   <ul>
		    <li><a href="#">常见问题</a></li>
			<li><a href="#">在线退换货</a></li>
		    <li><a href="#">在线投诉</a></li>
			<li><a href="#">配送范围</a></li>
		   </ul>
		</div>
	   </li>
       <li class="hd_menu_tit phone_c" data-addclass="hd_menu_hover"><a href="#" class="hd_menu "><em class="iconfont icon-phone"></em>手机版</a>
	    <div class="hd_menu_list erweima">
		   <ul>
            <img th:src="@{/resources/images/erweima.png}"  width="100px" height="100"/>
		   </ul>
		</div>
	   </li>
	  </ul>
	</div>
    </div>
  </div>
   <!--样式-->
<!--顶部样式2-->
<div id="header "  class="header page_style">
  <div class="logo"><a href="#"><img th:src="@{/resources/images/logo.png}" /></a></div>
  <!--可修改图层-->
  <div class="festival"><a href="#"><img th:src="@{/resources/images/logo_yd.png}" /></a></div>
</div>
<!--菜单导航样式-->
<div id="Menu" class="clearfix">
<div class="Inside_pages">
	<!--菜单栏-->
	<div class="Navigation" id="Navigation">
		 <ul class="Navigation_name">
			<li><a href="index.html">首页</a></li>
			 <li><a th:href="@{/product/product_list(id=1)}">图书</a></li>
			 <li><a th:href="@{/product/product_list(id=2)}">手机</a></li>
			 <li><a th:href="@{/product/product_list(id=4)}">数码</a></li>
			 <li><a th:href="@{/product/product_list(id=3)}">家用电器</a></li>
			 <li><a th:href="@{/product/product_list(id=8)}">个人化妆</a></li>
			 <li><a th:href="@{/product/product_list(id=6)}">电脑办公</a></li>
			 <li><a th:href="@{/product/product_list(id=14)}">食品饮品</a></li>
			 <li><a th:href="@{/product/product_list(id=9)}">服饰内衣</a></li>
			 <li><a th:href="@{/product/product_list(id=17)}">运动健康</a></li>
		 </ul>
		</div>
	<script>$("#Navigation").slide({titCell:".Navigation_name li"});</script>
  </div>
</div>
</div>
</div>
<!--购物车样式图层-->
<div class="Inside_pages">
 <div class="shop_carts">
   <div class="Process"></div>
 <div class="Shopping_list">
  <div class="title_name">
    <ul>
	<li class="checkbox"></li>
	<li class="name">商品名称</li>
	<li class="scj">市场价</li>
	<li class="bdj">本店价</li>
	<li class="sl">购买数量</li>
	<li class="xj">小计</li>
	<LI class="cz">操作</LI>
  </ul>
 </div>
  <div class="shopping">
  <form  method="post" th:action="@{/shopcart/msTopay}" >
 <table class="table_list">
   <tr class="tr" th:each="sh,iterStat:${shopCartList}" th:class="${iterStat.odd}? 'odd'">
   <td class="checkbox">
	   <input th:id="checkitems" th:value="${sh.product_id}" th:name="${iterStat.index}" th:type="checkbox"/></td>
    <td class="name">
	  <div class="img"><a href="#"><img th:src="${sh.product.main_image}" style="width: 120px; height: 120px; max-width: 100%;max-height: 100%;"/></a></div>
	  <div class="p_name"><a href="#" th:text="${sh.product.name}">金龙鱼 东北大米 蟹稻共生 盘锦大米5KG</a></div>
	</td>
	<td class="scj sp"><span id="Original_Price_1">￥<b th:text="${#numbers.formatDecimal(sh.product.price, 1, 2)}">39.50</b></span></td>
	<td class="bgj sp" ><span id="price_item_1">￥<b th:text="${#numbers.formatDecimal(sh.product.price*0.7, 1, 2)}">32.40</b></span></td>
	<td class="sl">
	    <div class="Numbers">
		  <a onClick="setAmount.reduce('#qty_item_1')" class="jian">-</a>
			<input type="text" name="qty_item_1" th:value="${sh.quantity}" id="qty_item_1" onkeyup="setAmount.modify('#qty_item_1')" class="number_text">
		  <a onclick="setAmount.add('#qty_item_1')" class="jia">+</a>
		 </div>
	</td>
	<td class="xj" ><span id="total_item_1"></span><input type="hidden" name="total_price" id="total_price" value=""></td>
	<td class="cz">
	 <p><a href="">删除</a>
	</td>
   </tr>
 </table>
 <div class="sp_Operation clearfix">
  <div class="select-all">
<!--
  <div class="cart-checkbox"><input type="checkbox"   id="CheckedAll" name="toggle-checkboxes" class="jdcheckbox" clstag="clickcart">全选</div>
  <div class="operation"><a href="javascript:void(0);" id="send">删除选中的商品</a></div>
-->
    </div>
	 <!--结算-->
	<div class="toolbar_right">
    <ul class="Price_Info">
    <li class="p_Total"><label class="text">商品总价：</label><span class="price sumPrice" id="Total_price" th:text="${totalprice}"></span></li>
	<li class="Discount"><label class="text">折&nbsp;&nbsp;后&nbsp;&nbsp;价：</label><span class="price" id="Preferential_price" th:text="${#numbers.formatDecimal(totalprice*0.7, 1, 2)}"></span></li>
    </ul>
		<button class="btn cartsubmit" type="submit" ></button>
	<div class="btn"><!--<a class="cartsubmit" th:href="@{/toOrder}"></a>--><a class="continueFind" th:href="@{/index}"></a></div>
  </div>
  </div>
   </form>
 </div>
 </div>
 </div>
</div>
  <!--底部样式-->
 <div class="ft_footer_service" id="footer">
  <div class="footerbox" >
  <!--底部-->
  <div class="Menu_style ensure ">
    <div class="phone">
    </div>
    <div class="icon_en">
     <a href="#" class="icon_link"><img th:src="@{/resources/images/footer_icon_31.png}" />
		 <span class="left"><h2>退换货</h2>7天无理由退换货</span>
	 </a>
     <a href="#" class="icon_link"><img th:src="@{/resources/images/footer_icon_33.png}" />
		 <span class="left"><h2>正品保障</h2>企业认证产品</span>
	 </a>
     <a href="#" class="icon_link"><img th:src="@{/resources/images/footer_icon_35.png}" />
		 <span class="left"><h2>满包邮</h2>满68元包邮</span>
	 </a>
     <a href="#" class="icon_link"><img th:src="@{/resources/images/footer_icon_37.png}" />
		 <span class="left"><h2>直供产品</h2>厂家直销平台</span>
	 </a>
    </div>
   </div>
  </div>
 </div>
 <!--底部样式-->
 <div class="footer">
  <div class="footerbox clearfix">
  <div class="clearfix">
   <div class="left help_link">
    <dl>
	 <dt>投保指南</dt>
	 <dd><a href="#">保险需求测试</a></dd>
     <dd><a href="#">专题及活动</a></dd>
     <dd><a href="#">挑选保险产品</a> </dd>
     <dd><a href="#">常见问题 </a></dd>
	</dl>
	<dl>
	 <dt>保险服务</dt>
	 <dd><a href="#">保险需求测试</a></dd>
     <dd><a href="#">专题及活动</a></dd>
     <dd><a href="#">挑选保险产品</a> </dd>
     <dd><a href="#">常见问题 </a></dd>
	</dl>
	<dl>
	 <dt>支付方式</dt>
	 <dd><a href="#">保险需求测试</a></dd>
     <dd><a href="#">专题及活动</a></dd>
     <dd><a href="#">挑选保险产品</a> </dd>
     <dd><a href="#">常见问题 </a></dd>
	</dl>
	<dl>
	 <dt>帮助中心</dt>
	 <dd><a href="#">保险需求测试</a></dd>
     <dd><a href="#">专题及活动</a></dd>
     <dd><a href="#">挑选保险产品</a> </dd>
     <dd><a href="#">常见问题 </a></dd>
	</dl>
   </div>
   <!--信息内容-->

  <!--认证-->
 <!--认证展示样式-->
<div class="Authenticate left clearfix" id="Authenticate_show">
  <div class="Authenticate_show">
  <div class="picMarquee-left">
			<div class="hd">
				<a class="next">&lt;</a>
				<a class="prev">&gt;</a>
			</div>
			<div class="bd">
				<ul class="picList">
					<li>
						<div class="pic"><a href="" target="_blank"><img th:src="@{/resources/images/pic1.jpg}" /></a></div>
                          <!--<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图1</a></div>-->
                    </li>
					<li>
						<div class="pic"><a href="" target="_blank"><img th:src="@{/resources/images/pic2.jpg}" /></a></div>
						<!--<div class="title"><a href="http://www.SuperSlide2.com" target="_blank">效果图2</a></div>-->
					</li>
					<li>
						<div class="pic"><a href="" target="_blank"><img th:src="@{/resources/images/pic3.jpg}" /></a></div>

					</li>
					<li>
						<div class="pic"><a href="" target="_blank"><img th:src="@{/resources/images/pic4.jpg}" /></a></div>

					</li>
				</ul>
			</div>
		</div>

		<script type="text/javascript">
		jQuery(".picMarquee-left").slide({mainCell:".bd ul",autoPlay:true,effect:"leftMarquee",vis:2,interTime:50});
		</script>
  </div>
</div>
  </div>
 <div class="text_link">
   <p>
  <a href="#">关于我们</a>｜ <a href="#">公开信息披露</a>｜ <a href="#">加入我们</a>｜ <a href="#">联系我们</a>｜ <a href="#">版权声明</a>｜ <a href="#">隐私声明</a>｜ <a href="#">网站地图</a></p>
  </div>
  </div>
 </div>
<script>
	function xuanzhong() {
		var val = $("#checkitems").val();
		alert(val.toString());
	}
</script>
</body>
</html>
